﻿
<?php
/*

Template Name:自定义搜索页面模板

*/

?>        
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
        <meta name="keywords" content="">
        <meta name="description" content=" ">
        <title>搜索-<?php bloginfo('name'); ?></title>
        <link rel="stylesheet" href="<?php bloginfo('template_directory'); ?>/css.css
">
		
        <main id="container">
            <h1><?php bloginfo('name'); ?>-<?php bloginfo('description'); ?></h1>
            <h2></h2>
            <div id="content">
                <section id="stage">
                    <img width="273" height="54" src="修改成自己的LOGO链接" id="logo" alt="Logo">
                    <div itemscope=""  id="search">
                        <link itemprop="url" href="<?php bloginfo('url'); ?>
">
       


<form role="search" method="get" id="portal_search" action="<?php bloginfo('url'); ?>/">
				<label>
					
					<input type="search" class="search-field" placeholder="搜索&hellip;" value="" name="s" id="search_input" />
				</label>
				<input type="submit" id="search_sub" class="search-submit" value="搜索" />
			</form>
                    </div>
                  
                                 <a itemprop="significantLink" class="browse" href="<?php bloginfo('url'); ?>">首页</a>
       
<div class="space"></div>
                    <div class="mountains">
                        <div class="mountain mountain-1"></div>
                        <div class="mountain mountain-2"></div>
                        <div class="mountain mountain-3"></div>
                    </div>
                    <div class="bear"></div>
                </section>
            </div>
        </main>
        <footer>
            <canvas id="bgCanvas" width="1366" height="657"></canvas>
            <script>
           
                function setsize(){
                    var b=22+(document.body.clientHeight-764)*5.5/164;
                    document.documentElement.style.fontSize = b+"px";
                    document.body.style.fontSize = b+"px";
                }
                setsize();
                window.onresize =setsize;
                (function() {
                    var requestAnimationFrame = window.requestAnimationFrame || window.mozRequestAnimationFrame ||
                        window.webkitRequestAnimationFrame || window.msRequestAnimationFrame || function( callback ){
                            window.setTimeout(callback, 1000 / 60);
                        };
                    window.requestAnimationFrame = requestAnimationFrame;
                })();
                var background = document.getElementById("bgCanvas"),
                    bgCtx = background.getContext("2d"),
                    width = window.innerWidth,
                    height = document.body.offsetHeight;
                (height < 400)?height = 400:height;
                background.width = width;
                background.height = height;
                function ShootingStar(){
                    this.reset();
                }
                ShootingStar.prototype.reset = function(){
                    this.x = Math.random()*width;
                    this.y = 0;
                    this.len = (Math.random()*80)+10;
                    this.speed = (Math.random()*10)+6;
                    this.size = (Math.random()*2)+0.1;
                    this.waitTime =  new Date().getTime() + (Math.random()*2000)+500;
                    this.active = false;
                }
                ShootingStar.prototype.update = function(){
                    if(this.active){
                        this.x-=this.speed;
                        this.y+=this.speed;
                        if(this.x<0 || this.y >= height){
                            this.reset();
                        }else{
                            bgCtx.lineWidth = this.size;
                            bgCtx.beginPath();
                            bgCtx.moveTo(this.x,this.y);
                            bgCtx.lineTo(this.x+this.len, this.y-this.len);
                            bgCtx.stroke();
                        }
                    }else{
                        if(this.waitTime < new Date().getTime()){
                            this.active = true;
                        }
                    }
                }
                var entities = [];
                entities.push(new ShootingStar());
                entities.push(new ShootingStar());
                function animate(){
                    var my_gradient=bgCtx.createLinearGradient(0,0,0,height);
                    my_gradient.addColorStop(0,"#07091E");
                    my_gradient.addColorStop(1,"#464854");
                    bgCtx.fillStyle = my_gradient;
                    bgCtx.fillRect(0,0,width,height);
                    bgCtx.strokeStyle = '#FFFFFF';
                    var entLen = entities.length;
                    while(entLen--){
                        entities[entLen].update();
                    }
                    requestAnimationFrame(animate);
                }
                animate();
            </script>
        </footer>
    
